#@layoutT("配置录制场景")
#define css()
<style type="text/css">
    .div-scroll{
        overflow:auto;
        border-top:1px solid #DCDCDC;
        border-left:1px solid #DCDCDC;
        border-bottom:1px solid #DCDCDC;
        min-width:345px;
        position: relative;
    }
    .l-layout-header {
        position: relative;
        padding-left: 10px;
        color: #183152;
        font-weight: bold;
        height: 30px;
        line-height: 30px;
        background: #fff;
        border-bottom: 1px solid #eee;
        overflow: hidden;
        cursor: pointer;
    }
    .layui-form-item .layui-inline {
        /* margin-bottom: 5px; */
        margin-right: 0px;
    }
    .f-form .layui-inline {
        margin-top: 3px;
        margin-bottom: 0px;
    }
    #container{
        background: #ffffff;
    }
    .search-model {
        margin-bottom: 0px;
        padding: 0px;
    }
    .layui-container-fluid{
        background: #ffffff;
    }
</style>
#end
#define main()
<div class="layui-row layui-col-space1 task-row">
    <div class="layui-col-xs6 div-scroll">
        <div class="l-layout-header"><span class="header-span">#(roleName)</span> 可选录制场景</div>
        <div class="l-scroll"style="left: 0px;top: 0px;">
            #@formStart()
            <div class="layui-inline">
                <input type="search" name="name" autocomplete="off" class="layui-input" placeholder="名称"/>
            </div>
            #@formEnd()
            <table id="maingrid" lay-filter="maingrid"></table>
        </div>
    </div>

    <div class="layui-col-xs6 div-scroll">
        <div class="l-layout-header"><span style="color:#5FB878"></span> 已选录制场景</div>
        <div class="l-scroll"style="left: 0px;top: 0px;">
            <form class="layui-form layui-form-pane f-form" id='searchForm1' lay-filter='searchForm1' action="javascript:;">
                <div class='layui-row layui-col-space1 task-row search-model'>
                    <div class='layui-col-xs12 '>
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <input type="search" name="name" autocomplete="off" class="layui-input" placeholder="名称"/>
                            </div>
                            <div class="layui-inline">
                                <div class="layui-btn-group">
                                    <button class="layui-btn" style=" height: 30px; line-height: 30px;    border-radius: 3px !important; font-size: 13px; margin-right: 10px !important;">
                                        <i class="layui-icon">&#xe615;</i>查询
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
            <table id="maingrid1" lay-filter="maingrid1"></table>
        </div>
    </div>
</div>
<!-- 	每行的操作按钮 -->
<script type="text/html" id="bar_maingrid">
    <a class="layui-btn layui-btn-xs" lay-event="add">选择</a>
</script>
<script type="text/html" id="bar_maingrid1">
    #if(roleCode=='superadmin')
    <a class="layui-btn layui-btn-xs layui-btn-danger {{d.user_code=='superadmin'?"layui-disabled":""}}" lay-event="remove{{d.user_code=='superadmin'?"layui-disabled":""}}">移除</a>
    #elseif(roleCode=="admin")
    <a class="layui-btn layui-btn-xs layui-btn-danger {{d.user_code=='admin'?"layui-disabled":""}}" lay-event="remove{{d.user_code=='admin'?"layui-disabled":""}}">移除</a>
    #else
    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="remove">移除</a>
    #end
</script>
#end

#define js()
<!-- 分页表格 -->
<script>
    var groupId="#(groupId)";
    function addGroup(obj){
        var data=obj.data;
        var recordId=data.id;
        var url="#(path)/record/group/addGroup?groupId="+groupId + "&recordId="+recordId;
        $.ajax({
            url
            ,type:"POST"
            ,success:function(data){
                $(".layui-laypage-btn").click();
                if(num==0){
                    queryUserListInRecordGroup();
                }
                layer.msg(data.msg);
            }
        });
    }

    function removeGroup(obj){
        var data=obj.data;
        var recordId=data.id;
        var url="#(path)/record/group/removeGroup?groupId="+groupId + "&recordId="+recordId;
        $.ajax({
            url
            ,type:"POST"
            ,success:function(data){
                refreshData();
                layer.msg(data.msg);
            }
        });
    }

    var num=0;
    function queryUserListInRecordGroup(){
        var url="#(path)/record/group/queryUserListInRecordGroup"
        $.ajax({
            url
            ,type:"POST"
            ,success:function(data){
                num=data.totalRow;
                if(data.totalRow<=1){
                    table.reload('maingrid1', {});
                }
            }
        });
    }

    //未选用户列表
    gridArgs.title='用户';
    gridArgs.dataId='id';
    gridArgs.gridDivId ='maingrid';
    gridArgs.heightDiff =80;
    initGrid({id : 'maingrid'
        ,elem : '#maingrid'
        ,cellMinWidth: 80
        ,cols : [ [
            {title:'序号',type:'numbers',width:35},
            {title: '主键',field : 'id',width : 35,checkbox : true},
            {title: '名称', field: 'name'},
            {title: '唯一标识', field: 'identifier'},
            {title: '应用名称', field: 'app_name'},
            {title: '操作',fixed:'right',width : 100,align : 'left',toolbar : '#bar_maingrid'} // 这里的toolbar值是模板元素的选择器
        ] ]
        ,url:"#(path)/record/group/queryUserListNotInRecordGroup?groupId="+groupId
        ,searchForm : 'searchForm'
    },{add:addGroup});

    //已选用户列表
    initGrid({id : 'maingrid1'
        ,elem : '#maingrid1'
        ,cellMinWidth: 80
        ,cols : [ [
            {title:'序号',type:'numbers',width:35},
            {title: '主键',field : 'id',width : 35,checkbox : true},
            {title: '名称', field: 'name'},
            {title: '唯一标识', field: 'identifier'},
            {title: '应用名称', field: 'app_name'},
            {title: '操作',fixed:'right',width : 100,align : 'left',toolbar : '#bar_maingrid1'} // 这里的toolbar值是模板元素的选择器
        ] ]
        ,url:"#(path)/record/group/queryUserListInRecordGroup?groupId="+groupId
        ,searchForm : 'searchForm1'
    },{remove:removeGroup});

</script>
#end

  